<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>10.series系列</title>
</head>
<body>
  <!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>10-series系列</title>
</head>
<body>
  <div id="charts1" style="width:600px;height:400px;border:1px solid #f00"></div>
  <script src="./echarts/echarts.min.js"></script>
  <script>
    // 1. 获取页面中的标签对象并初始化
    const myChart = echarts.init(document.getElementById('charts1'))

    // const option = {}
    // 2. 根据参数绘制图形
    myChart.setOption({
      xAxis:{
        data:['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec']
      },
      yAxis:{
        // data:[100,200,300,400,500,600,700,800,900,1000,1100,1200]
      },
      series:[
        {
          type:'bar',
          data:[20,14,32,46,24,23,23,13,26,20,24,15]
        },
        {
          type:'line',
          data:[34,28,45,69,39,43,33,23,23,33,39,22]
        },
        {
          type:'pie',
          center:['65%',60],
          radius:55,
          data:[
            {name:'小米',value:52},
            {name:'华为',value:54},
            {name:'中兴',value:50},
            {name:'OPPO',value:42},
            {name:'ViVo',value:43}
          ]
        }
      ]
    })
  </script>
</body>
</html>
</body>
</html>